<template>
  <!-- 关闭 -->
  <a-modal
    :width="500"
    :visible="closeVisible"
    @ok="handleCloseSubmit"
    @cancel="handleCloseClose"
    cancelText="关闭"
    title="关闭工单"
  >
    <a-spin :spinning="confirmLoading">
      <a-form layout="horizontal">
        <a-row :gutter="24">
          <a-col>
            <a-form-model-item
              label="关闭原因："
              :label-col="{ span: 5 }"
              :wrapper-col="{ span: 16 }"
              prop="shutdownReason"
              :rules="$valid.required"
            >
              <a-select
                v-model="closes.shutdownReason"
                placeholder="请选择关闭原因"
                @change="forceUpdate"
              >
                <a-select-option
                  v-for="item in this.$sysDictOptions('shutdownReason')"
                  :key="item.k"
                  :value="item.k"
                >
                  {{ item.v }}
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col>
            <a-form-model-item
              label="备注："
              :label-col="{ span: 5 }"
              :wrapper-col="{ span: 16 }"
              prop="closeRemarks"
            >
              <a-input v-model="closes.closeRemarks" type="textarea" />
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form>
    </a-spin>
  </a-modal>
</template>

<script>
import moment from 'moment'
import { postAction } from '@/api/manage'
import WImageUpload from '@/components/WxImageUpload/WImageUpload'
import WFileUpload from '@/components/WxFileUpload/WFileUpload.vue'

export default {
  name: 'CloseForm',
  components: {
    WImageUpload,
    WFileUpload,
  },
  computed: {},
  data() {
    return {
      confirmLoading: false,
      closeVisible: false,
      closes: {
        ids: undefined,
        shutdownReason: undefined,
        closeRemarks: undefined,
      },

      current: 0,
      url: {
        update: '/system/devMaintenance/update',
      },
    }
  },
  created() {},
  methods: {
    forceUpdate() {
      this.$forceUpdate()
    },
    moment,

    //START 关闭
    handleClose(id) {
      this.closeVisible = true
      this.closes = {}
      this.closes.ids = id
    },

    handleCloseSubmit() {
      if (!this.closes.shutdownReason) {
        this.$message.error('请选择关闭原因')
        return
      }

      this.closeVisible = true
      this.closes.workOrderStatus = '5'
      postAction(this.url.update, this.closes).then((resp) => {
        this.$message.success('工单关闭成功')
        this.handleCloseClose()
      })
    },
    handleCloseClose() {
      this.closeVisible = false
      this.closes = {}
      this.$emit('close')
    },
    //END 关闭
  },
}
</script>
<style scoped>
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC',
    'Microsoft YaHei', sans-serif;
  background-color: #f0f2f5;
  color: #333;
  padding: 20px;
}
</style>
